<template>
	<div class="recommend">
		<div v-for="item in recommends" class="recommend-item">
			<a :href="item.link">
				<img :src="item.image" alt="">
				<div>{{item.title}}</div>
			</a>
		</div>
	</div>
</template>

<script scoped>
	export default{
		name:'RecommendView',
		props:{
			recommends:{
				type:Array,
				default(){
					return []
				}
			}
			
		}
	}
</script>

<style>
	.recommend{
		display: flex;
		width: 100%;
		padding: 10px 0 20px;
		font-size: 12px;
		border-bottom: 10px solid #eee;
	}
	.recommend-item{
		flex: 1;
		text-align: center;
	}
		.recommend-item a{
			text-decoration: none;
			color: #2E2E2E;
		}
	.recommend img{
		width: 70px;
		height: 70px;
		margin-bottom: 10px;
	}

</style>
